<template>
	<view class="login-wrapper">
		<!-- <view class="zhuce">注册账号</view> -->
		<view style="position: relative;top: 900rpx;z-index: 999;height: 0;">
			<view style="-webkit-align-items: center;display: flex;background-color: #fff;width: 50%;padding-left: 120rpx;border-radius: 60rpx;margin: auto;height: 74rpx;" @click="openUrl(1)">
				<view style="width: 50rpx;height:50rpx;margin-bottom: 10rpx;">
					<image style="width: 100%;height: 100%;" src="../../../static/images/apk.png" />
				</view>
				<view class="fz-16 c_333" style="padding-left: 10rpx;">安卓 下载</view>
			</view>
			<!-- <view style="-webkit-align-items: center;display: flex;background-color: #fff;width: 50%;padding-left: 120rpx;border-radius: 60rpx;margin:60rpx auto;height: 74rpx;" @click="openUrl(2)">
				<view style="width: 70rpx;height:70rpx;margin-bottom: 10rpx;">
				  <image style="width: 100%;height: 100%;" src="../../../static/images/iPhone.png"/>
				</view>
				<view class="fz-16 c_333">IOS 下载</view>
			</view> -->
		</view>
		<image class="zhiying" src="../../../static/images/zhiyinxiazai.png" mode=""></image>
	</view>
</template>
<script>
	import sendVerifyCode from "@/mixins/SendVerifyCode";
	import lPainter from '@/components/lime-painter/index'
	import {
		getCity
	} from '@/api/api.js';
	import {
		register,
		registerVerify,
		getAPPDownUrl,
		getCodeApi,
		getUserInfo,
	} from "@/api/user";

	const BACK_URL = "login_back_url";

	export default {
		name: "Login",
		mixins: [sendVerifyCode],
		components: {
			lPainter,
		},
		data: function() {
			return {
				path: null,
				account: "",		//手机号码
				password: "",		//密码
				verifyPassword: "", //确认密码
				payment_code: "", 	//支付密码
				inviteCode: "", 	//邀请码
				inviteID:"",		//邀请ID
				captcha: "",		//验证码
				formItem: 1,
				type: "login",
				keyCode: "",
				base: null,
				zhiyin: false,
				iosurl: '',
				apkurl: '',
				region: ['省', '市', '区'],
				valueRegion: [0, 0, 0],
				multiArray: [],
				multiIndex: [0, 0, 0],
				cityId: 0,
				regionDval: ['浙江省', '杭州市', '滨江区'],
				district: [],
				lPainter:0,
			};
		},
		onLoad: function(options) {
			this.inviteID = options.spread
			this.getCityList();
		},
		watch: {
			formItem: function(nval, oVal) {
				if (nval == 1) {
					this.type = "login";
				} else {
					this.type = "register";
				}
			},
		},
		
		mounted: function() {
			//  #ifdef H5

			this.getDownUrl()
			const {
				user_code
			} = this.$route.query
			if (user_code) {
				this.inviteCode = user_code
			}
			//  #endif 
		},
		methods: {

			// 回去地址数据
			getCityList: function() {
				let that = this;
				getCity().then(res => {
					this.district = res.data
					that.initialize();
				})
			},
			initialize: function() {
				let that = this,
					province = [],
					city = [],
					area = [];
				if (that.district.length) {
					let cityChildren = that.district[0].c || [];
					let areaChildren = cityChildren.length ? (cityChildren[0].c || []) : [];
					that.district.forEach(function(item) {
						province.push(item.n);
					});
					cityChildren.forEach(function(item) {
						city.push(item.n);
					});
					areaChildren.forEach(function(item) {
						area.push(item.n);
					});
					this.multiArray = [province, city, area]
				}
			},
			bindRegionChange: function(e) {
				let multiIndex = this.multiIndex,
					province = this.district[multiIndex[0]] || {
						c: []
					},
					city = province.c[multiIndex[1]] || {
						v: 0
					},
					multiArray = this.multiArray,
					value = e.detail.value;

				this.region = [multiArray[0][value[0]], multiArray[1][value[1]], multiArray[2][value[2]]]
				this.cityId = city.v
				this.valueRegion = [0, 0, 0]
				this.initialize();
			},
			bindMultiPickerColumnChange: function(e) {
				let that = this,
					column = e.detail.column,
					value = e.detail.value,
					currentCity = this.district[value] || {
						c: []
					},
					multiArray = that.multiArray,
					multiIndex = that.multiIndex;
				multiIndex[column] = value;
				switch (column) {
					case 0:
						let areaList = currentCity.c[0] || {
							c: []
						};
						multiArray[1] = currentCity.c.map((item) => {
							return item.n;
						});
						multiArray[2] = areaList.c.map((item) => {
							return item.n;
						});
						break;
					case 1:
						let cityList = that.district[multiIndex[0]].c[multiIndex[1]].c || [];
						multiArray[2] = cityList.map((item) => {
							return item.n;
						});
						break;
					case 2:

						break;
				}
				// #ifdef MP || APP-PLUS
				this.$set(this.multiArray, 0, multiArray[0]);
				this.$set(this.multiArray, 1, multiArray[1]);
				this.$set(this.multiArray, 2, multiArray[2]);
				// #endif
				// #ifdef H5 
				this.multiArray = multiArray;
				// #endif



				this.multiIndex = multiIndex
				// this.setData({ multiArray: multiArray, multiIndex: multiIndex});
			},
			getUrlParam(name) {
				var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
				var r = window.location.search.substr(1).match(reg);
				if (r != null) return unescape(r[2]);
				return null;
			},
			openUrl(type) {
				if (type == 1) {
					try {
						window.open(this.apkurl)
						this.lPainter = 1;
						// this.$refs.lPainter.open()
					} catch (error) {
						uni.showModal({
							title: '提示',
							content: '您还未安装浏览器，请先安装浏览器',
							showCancel: false,
							success: function(res) {

							}
						});
					}

				} else {
					window.open(this.iosurl)
				}

			},
			back() {
				this.$util.goBack();
			},
			// app下载链接
			getDownUrl() {
				getAPPDownUrl().then(res => {
					this.apkurl = res.data.apkurl
					this.iosurl = res.data.iosurl
					this.base = {
						width: '686rpx',
						height: '700rpx',
						views: [{
							type: 'qrcode',
							text: this.apkurl,
							css: {
								left: '130rpx',
								top: '150rpx',
								width: '450rpx',
								height: '450rpx',
								color: '#333333',
								border: '20rpx solid transparent',
							},
						}, ],
					}
				})
			},
			async getCode() {
				let that = this;
				if (!that.account) return that.$util.Tips({
					title: '请填写手机号码'
				});
				if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account)) return that.$util.Tips({
					title: '请输入正确的手机号码'
				});
				if (that.formItem == 2) that.type = "register";
				await registerVerify({
						phone: that.account,
						type: that.type,
						key: that.keyCode
					})
					.then(res => {
						that.$util.Tips({
							title: res.msg
						});

						that.sendCode();
					})
					.catch(res => {
						console.log(res, 'res')
						that.$util.Tips({
							title: res
						});
					});
			},
			code() {
				let that = this
				getCodeApi()
					.then(res => {
						that.keyCode = res.data.key;
						that.getCode();
					})
					.catch(res => {
						that.$util.Tips({
							title: res
						});
					});
			},
			async registerUser() {
				let that = this;
				if (!that.inviteID)
					return that.$util.Tips({
						title: "请填写邀请人ID",
					});
				if (that.region[0] == '省') 
					return that.$util.Tips({
						title: '请选择所在地区'
					});
				if (!that.account)
					return that.$util.Tips({
						title: "请填写手机号码",
					});
				if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.account))
					return that.$util.Tips({
						title: "请输入正确的手机号码",
					});
				if (!that.captcha)
					return that.$util.Tips({
						title: "请填写验证码",
					});
				if (!/^[\w\d]+$/i.test(that.captcha))
					return that.$util.Tips({
						title: "请输入正确的验证码",
					});
				if (!that.password)
					return that.$util.Tips({
						title: "请填写密码",
					});
				if (!that.verifyPassword)
					return that.$util.Tips({
						title: "请填写确认密码",
					});
				// if (!that.payment_code)
				// 	return that.$util.Tips({
				// 		title: "请填写支付密码",
				// 	});
				if (/^([0-9]|[a-z]|[A-Z]){0,6}$/i.test(that.password))
				  return that.$util.Tips({
				    title: "您输入的密码过于简单",
				  });
				if (that.password != that.verifyPassword)
					return that.$util.Tips({
						title: "两次输入密码不一致",
					});
				if (that.zhiyin == false)
					return that.$util.Tips({
						title: "请勾选同意隐私协议",
					});
				uni.showLoading();
				register({
						account: that.account,
						captcha: that.captcha,
						spread: that.inviteCode,
						spreadID: that.inviteID,
						password: that.password,
						area: that.area,
						province: that.region[0],
						city: that.region[1],
						district: that.region[2],
					})
					.then((res) => {
						uni.hideLoading();
						//  #ifdef H5
						uni.showToast({
							title: '注册成功,APP下载中',
							duration: 2000,
						});
						//  #endif
					})
					.catch((res) => {
						uni.hideLoading();
						that.$util.Tips({
							title: "注册失败，已注册请下载APP登录",
						});
					});
			},

		},
	};
</script>
<style lang="scss" scoped>
	page{
		min-height: 100vh;
	}
	.zhiying{
		width: 100%;
		min-height: 100vh;
	}
</style>
